﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="TCDC_System.Content.Default" %>

<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<%@ Register TagPrefix="uc" Src="~/UserControl/FavoritesAdd.ascx" TagName="FavoritesAdd" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <style type="text/css">
        .comboBoxStyle
        {
            font-size: 18px;
            height: 30px !important;
        }
        div.item-wrap
        {
            float: left;
            border: 1px solid transparent;
            margin: 5px 25px 5px 25px;
            width: 100px;
            cursor: pointer;
            height: 120px;
            text-align: center;
        }
        
        div.item-wrap img
        {
            margin: 5px 0px 0px 5px;
            width: 90px;
            height: 90px;
        }
        
        div.item-wrap h6
        {
            font-size: 12px;
            color: #3A4B5B;
            font-family: tahoma,arial,san-serif;
        }
        
        .items-view .x-view-over
        {
            border: solid 1px silver;
        }
        
        #items-ct
        {
            padding: 0px 30px 24px 30px;
        }
        
        #items-ct h2
        {
            border-bottom: 2px solid #3A4B5B;
            cursor: pointer;
        }
        
        #items-ct h2 div
        {
            background: transparent url(../Attribute/images/icons/group-expand-sprite.gif) no-repeat 3px -47px;
            padding: 4px 4px 4px 17px;
            font-family: tahoma,arial,san-serif;
            font-size: 12px;
            color: #3A4B5B;
        }
        
        #items-ct .collapsed h2 div
        {
            background-position: 3px 3px;
        }
        #items-ct dl
        {
            margin-left: 2px;
        }
        #items-ct .collapsed dl
        {
            display: none;
        }
        
        .west-panel .x-layout-collapsed-west
        {
            background: url(../Attribute/images/icons/collapsed-west.png) no-repeat center;
        }
        
        .south-panel .x-layout-collapsed-south
        {
            background: url(../Attribute/images/icons/collapsed-south.png) no-repeat center;
        }
    </style>
    <script type="text/javascript">

        var filterTree = function (el, e) {
            var tree = TreePanel1,
                text = this.getRawValue();

            tree.clearFilter();

            if (Ext.isEmpty(text, false)) {
                return;
            }

            if (e.getKey() === Ext.EventObject.ESC) {
                clearFilter();
            } else {
                var re = new RegExp(".*" + text + ".*", "i");

                tree.filterBy(function (node) {
                    return re.test(node.text);
                });
            }
        };

        var clearFilter = function () {
            var field = TriggerField1,
                tree = TreePanel1;

            field.setValue("");
            tree.clearFilter();
            tree.getRootNode().collapseChildNodes(true);
            tree.getRootNode().ensureVisible();
        };

        var loadPageTreePanel = function (tabPanel, node) {

            var tab = tabPanel.getItem(node.id);

            if (!tab) {
                tab = tabPanel.add({
                    id: node.id,
                    title: node.text,
                    closable: true,
                    autoLoad: {
                        showMask: true,
                        url: node.attributes.href,
                        mode: "iframe"
                    },
                    listeners: {
                        update: {
                            fn: function (tab, cfg) {
                                cfg.iframe.setHeight(cfg.iframe.getSize().height - 20);
                            },
                            scope: this,
                            single: true
                        }
                    }
                });
            }
            tabPanel.setActiveTab(tab);
        }

        var loadPageDashboard = function (tabPanel, node) {

            var tab = tabPanel.getItem(node.id);

            if (!tab) {
                tab = tabPanel.add({
                    id: node.id,
                    title: node.innerText,
                    closable: true,
                    autoLoad: {
                        showMask: true,
                        url: node.all[2].href,
                        mode: "iframe"
                    },
                    listeners: {
                        update: {
                            fn: function (tab, cfg) {
                                cfg.iframe.setHeight(cfg.iframe.getSize().height - 20);
                            },
                            scope: this,
                            single: true
                        }
                    }
                });
            }

            tabPanel.setActiveTab(tab);
        }

        var loadPageLastRegis = function (tabPanel, user_campaign_id) {
            var tab = tabPanel.getItem("24" + user_campaign_id);
            if (!tab) {
                tab = tabPanel.add({
                    id: "24" + user_campaign_id,
                    title: "สมัครสมาชิก",
                    closable: true,
                    autoLoad: {
                        showMask: true,
                        url: "/content/TransectionData/member_profile.aspx?user_campaign_id=" + user_campaign_id,
                        mode: "iframe"
                    },
                    listeners: {
                        update: {
                            fn: function (tab, cfg) {
                                cfg.iframe.setHeight(cfg.iframe.getSize().height - 20);
                            },
                            scope: this,
                            single: true
                        }
                    }
                });
            }
   
            tabPanel.setActiveTab(tab);
        }

        var viewClick = function (dv, e) {
            var group = e.getTarget("h2", 3, true);

            if (group) {
                group.up("div").toggleClass("collapsed");
            }
        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <ext:ResourceManager ID="ResourceManager1" runat="server" />
    <ext:Store ID="Store1" runat="server">
        <Reader>
            <ext:JsonReader>
                <Fields>
                    <ext:RecordField Name="Title" />
                    <ext:RecordField Name="Items" IsComplex="true" />
                </Fields>
            </ext:JsonReader>
        </Reader>
    </ext:Store>
    <ext:Viewport ID="Viewport1" runat="server" Layout="BorderLayout">
        <Items>
            <ext:Panel ID="Panel2" runat="server" Region="West" Layout="AccordionLayout" Width="230"
                MinWidth="230" MaxWidth="400" Split="true" Collapsible="true" Collapsed="true" CtCls="west-panel">
                <Items>
                    <ext:RowLayout ID="RowLayout1" runat="server" Split="true">
                        <Rows>
                            <ext:LayoutRow>
                                <ext:Panel ID="Panel3" runat="server" Height="100" Padding="2">
                                    <Items>
                                        <ext:TextField ID="LastRegister" runat="server" Text="0" Hidden="true" />
                                        <ext:Image ID="Image1" runat="server" ImageUrl="../Attribute/images/logo/logo.jpg"
                                            Align="Left" />
                                    </Items>
                                </ext:Panel>
                            </ext:LayoutRow>
                            <ext:LayoutRow>
                                <ext:TreePanel ID="TreePanel1" runat="server" Width="230" UseArrows="true" Title="Main Menu"
                                    Icon="ChartOrganisation">
                                    <TopBar>
                                        <ext:Toolbar ID="Toolbar1" runat="server">
                                            <Items>
                                                <ext:ToolbarTextItem ID="ToolbarTextItem1" runat="server" Text="Filter:" />
                                                <ext:ToolbarSpacer />
                                                <ext:TriggerField ID="TriggerField1" runat="server" EnableKeyEvents="true">
                                                    <Triggers>
                                                        <ext:FieldTrigger Icon="Clear" />
                                                    </Triggers>
                                                    <Listeners>
                                                        <KeyUp Fn="filterTree" Buffer="250" />
                                                        <TriggerClick Handler="clearFilter();" />
                                                    </Listeners>
                                                </ext:TriggerField>
                                                <ext:ToolbarFill ID="ToolbarFillList" runat="server" />
                                                <ext:SplitButton ID="SplitButton1" runat="server" Icon="Cog">
                                                    <Menu>
                                                        <ext:Menu ID="Menu1" runat="server">
                                                            <Items>
                                                                <ext:MenuItem ID="MenuItem1" runat="server" Text="Expand All">
                                                                    <Listeners>
                                                                        <Click Handler="#{TreePanel1}.expandAll();" />
                                                                    </Listeners>
                                                                </ext:MenuItem>
                                                                <ext:MenuItem ID="MenuItem2" runat="server" Text="Collapse All">
                                                                    <Listeners>
                                                                        <Click Handler="#{TreePanel1}.collapseAll();" />
                                                                    </Listeners>
                                                                </ext:MenuItem>
                                                            </Items>
                                                        </ext:Menu>
                                                    </Menu>
                                                </ext:SplitButton>
                                            </Items>
                                        </ext:Toolbar>
                                    </TopBar>
                                    <Listeners>
                                        <Click Handler="if (node.attributes.href) { e.stopEvent(); loadPageTreePanel(#{Pages}, node); }" />
                                    </Listeners>
                                </ext:TreePanel>
                            </ext:LayoutRow>
                        </Rows>
                    </ext:RowLayout>
                </Items>
            </ext:Panel>
            <ext:TabPanel ID="Pages" runat="server" Region="Center" EnableTabScroll="true">
                <Items>
                    <ext:Panel ID="DashBoardPanel" runat="server" Cls="items-view" Border="false" Title="Console"
                        Icon="House">
                        <Items>
                            <ext:RowLayout ID="RowLayout3" runat="server" Split="true">
                                <Rows>
                                    <ext:LayoutRow RowHeight="0.1">
                                        <ext:Panel ID="PanelSearch" runat="server" Border="false" Padding="8" LabelWidth="100"
                                            Frame="true">
                                            <Items>
                                                <ext:CompositeField ID="CompositeField75" runat="server" FieldLabel="เงื่อนไขการค้นหา"
                                                    AnchorHorizontal="100%">
                                                    <Items>
                                                        <ext:ComboBox ID="C01" runat="server" Width="100"  >
                                                        </ext:ComboBox>
                                                        <ext:TextField ID="TextField25" runat="server" Width="400" />
                                                        <ext:ComboBox ID="C02" runat="server" Width="100" >
                                                        </ext:ComboBox>
                                                       <%-- Cls="comboBoxStyle"--%>
                                                        <ext:Button ID="btSearch" runat="server" Icon="Zoom">
                                                        </ext:Button>
                                                    </Items>
                                                </ext:CompositeField>
                                            </Items>
                                        </ext:Panel>
                                    </ext:LayoutRow>
                                    <ext:LayoutRow RowHeight="0.6">
                                        <ext:Panel ID="Panel1" runat="server" Border="false" Padding="8" LabelWidth="100">
                                            <Items>
                                                <ext:DataView ID="Dashboard" runat="server" StoreID="Store1" SingleSelect="true"
                                                    OverClass="x-view-over" ItemSelector="div.item-wrap" AutoHeight="true" EmptyText="No items to display">
                                                    <Template ID="Template1" runat="server">
                                                        <Html>
                                                            <div id="items-ct">
								<tpl for=".">
									<div  class="group-header">
										
										<dl>
											<tpl for="Items">
												<div id="{Id}" class="item-wrap">
													<img src="{Icon}"/>
													<div>
														<a href="{Url}"><H6>{Title}</H6></a>                                                    
													</div>
												</div>
											</tpl>
											<div style="clear:left"></div>
										 </dl>
									</div>
								</tpl>
							</div>
                                                        </Html>
                                                    </Template>
                                                    <Listeners>
                                                        <Click Handler="if (node.id) { e.stopEvent(); loadPageDashboard(#{Pages}, node); }" />
                                                        <ContainerClick Fn="viewClick" />
                                                    </Listeners>
                                                    <DirectEvents>
                                                        <Click OnEvent="SetCollapsed" />
                                                    </DirectEvents>
                                                </ext:DataView>
                                            </Items>
                                        </ext:Panel>
                                    </ext:LayoutRow>
                                    <ext:LayoutRow RowHeight="0.3">
                                        <ext:GridPanel ID="GridPanelLastRegister" runat="server" Region="Center" DDGroup="gridDDGroup"
                                            EnableDragDrop="false" StripeRows="true" Title="กรอกข้อมูลสมัครสมาชิกล่าสุด"
                                            Icon="KeyboardAdd">
                                            <Store>
                                                <ext:Store runat="server" ID="StoreUserInnerJoinCampaign">
                                                    <Reader>
                                                        <ext:JsonReader IDProperty="user_campaign_id">
                                                            <Fields>
                                                                <ext:RecordField Name="user_campaign_id" />
                                                                <ext:RecordField Name="reference_no" />
                                                                <ext:RecordField Name="id_card" />
                                                                <ext:RecordField Name="fname_th" />
                                                                <ext:RecordField Name="lname_th" />
                                                                <ext:RecordField Name="fname_en" />
                                                                <ext:RecordField Name="lname_en" />
                                                                <ext:RecordField Name="create_date" />
                                                            </Fields>
                                                        </ext:JsonReader>
                                                    </Reader>
                                                </ext:Store>
                                            </Store>
                                            <ColumnModel>
                                                <Columns>
                                                    <ext:RowNumbererColumn />
                                                    <ext:Column Header="User Campaign ID" DataIndex="user_campaign_id" Hidden="true" />
                                                    <ext:Column Header="Reference No" DataIndex="reference_no" Width="150" />
                                                    <ext:Column Header="บัตรประชาชน/หนังสือเดินทาง" DataIndex="id_card" Width="150" />
                                                    <ext:Column Header="ชื่อ (ไทย)" DataIndex="fname_th" Width="150" />
                                                    <ext:Column Header="นามสกุล (ไทย)" DataIndex="lname_th" Width="150" />
                                                    <ext:Column Header="ชื่อ (อังกฤษ)" DataIndex="fname_en" Width="150" />
                                                    <ext:Column Header="นามสกุล (อังกฤษ)" DataIndex="lname_en" Width="150" />
                                                    <ext:Column Header="create_date" DataIndex="create_date" Width="150" />
                                                </Columns>
                                            </ColumnModel>
                                            <SelectionModel>
                                                <ext:RowSelectionModel ID="RowSelectionModel1" runat="server" SingleSelect="true">
                                                    <DirectEvents>
                                                        <RowSelect OnEvent="rowSelectLastRegister" Buffer="100">
                                                            <ExtraParams>
                                                                <ext:Parameter Name="select_user_campaign_id" Value="this.getSelected().data.user_campaign_id"
                                                                    Mode="Raw" />
                                                            </ExtraParams>
                                                        </RowSelect>
                                                    </DirectEvents>
                                                </ext:RowSelectionModel>
                                            </SelectionModel>
                                            <LoadMask ShowMask="true" />
                                            <BottomBar>
                                                <ext:PagingToolbar ID="PagingToolbar1" runat="server" PageSize="4" DisplayInfo="true"
                                                    EmptyMsg="No Request to display" />
                                            </BottomBar>
                                        </ext:GridPanel>
                                    </ext:LayoutRow>
                                </Rows>
                            </ext:RowLayout>
                        </Items>
                    </ext:Panel>
                </Items>
            </ext:TabPanel>
            <ext:Panel ID="PanelStatus" runat="server" Region="South" >
                <BottomBar>
                    <ext:StatusBar ID="StatusBar4" CtCls="word-status" runat="server" DefaultText="TCDC System">
                        <Items>
                            <ext:ToolbarFill ID="ToolbarFill1" runat="server" />
                            <ext:ToolbarTextItem ID="loginBy" runat="server" Text="Login By : Admin" CtCls="x-status-text-panel" />
                            <ext:ToolbarSeparator ID="ToolbarSeparator2" runat="server" />
                            <ext:ToolbarTextItem ID="clock" runat="server" Text=" " CtCls="x-status-text-panel" />
                        </Items>
                    </ext:StatusBar>
                </BottomBar>
            </ext:Panel>
        </Items>
    </ext:Viewport>
    <uc:FavoritesAdd ID="FavoritesAdd1" runat="server" />
    <ext:TaskManager ID="TaskManager1" runat="server">
        <Tasks>
            <ext:Task TaskID="servertime" Interval="5000">
                <DirectEvents>
                    <Update OnEvent="RefreshTime">
                    </Update>
                </DirectEvents>
            </ext:Task>
        </Tasks>
    </ext:TaskManager>
    </form>
</body>
</html>
